<template>
  <div class="typelist">
    <div class="typelist-all">
      <img src="https://i0.hdslb.com/bfs/tag/12e3b733a4ed3e3f6b5c0d9b4bd1d0e1af8a30c3.jpg@115w_115h_1c_100q.webp" alt="">
      <div class="right">
        <li><h3>{{ types }}</h3></li>
        <li class="li2">
          35个内容 | 10万次观看 | 15个精选
        </li>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props:{
    types: {
      type: String
    }
  }
}
</script>

<style lang="scss" scoped>
.typelist-all{
  padding-left: 230px;
  height: 188px;
  display: flex;
  align-items: center;
  gap: 10px;
}
img{
  width: 70px;
  height: 70px;
  border: 2px solid slategrey;
}
.right{
  color: #fff;
  font-size: 14px;
  height: 70px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.li2{
  border: 1px solid #fff;
  padding: 5px 20px;
  font-size: 11px;
  font-weight: 200;
  color: rgb(214, 213, 213);
}
</style>